{include file="common/head"}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jodit/3.24.2/jodit.es2018.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jodit/3.24.2/jodit.es2018.min.js"></script>

</head>

<body style="text-align: left;">
  <div class="container p-3" style="max-width: 800px;">
    <h2>商品编辑</h2>
    <form method="post" enctype="multipart/form-data" action="/index.php/goods/edit">
      <input type="hidden" name="id" id="id" value="{$data.id}" />
      <div class="mb-3 row">
        <div class="col-2">
          <lable for="fid" class="form-label">商品分类: </label>
        </div>
        <div class="col-10">
          <select id="cat_id" name="cat_id" class="form-control">
            {foreach $cats as $k=>$v}
            <option value="{$k}" {if $k==$data.cat_id} selected style="color:blue;font-weight: bold;" {/if}>
              {if $v['deepth']==1}
              ├─
              {elseif $v['deepth']==2}
              &nbsp;&nbsp;&nbsp;&nbsp;├─
              {elseif $v['deepth']==3}
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;├─
              {/if}
              {$v['name']}
            </option>
            {/foreach}
          </select>
        </div>
      </div>


      <div class="mb-3 row">
        <div class="col-2">
          <lable for="name" class="form-label">品名:</label>
        </div>
        <div class="col-10">
          <input type="text" class="form-control" id="name" name="name" value="{$data.name}" placeholder="Goods name" />
        </div>
      </div>

      <div class="mb-3 row">
        <div class="col-2"><label for="desc" class="form-label">产品说明:</label></div>
        <div class="col-10">
          <input type="text" class="form-control" id="desc" name="desc" value="{$data.desc}" placeholder="说明" />
        </div>
      </div>

      <div class="mb-3 row">
        <div class="col-2">
          <label for="unit" class="form-label">标准单位:</label>
        </div>
        <div class="col-10">
          <input type="text" class="form-control" id="unit" name="unit" value="{$data.unit}" placeholder="unit" />
        </div>
      </div>

      <div class="mb-3 row">
        <div class="col-2">
          <label for="price" class="form-label">标准价格:</label>
        </div>
        <div class="col-10">
          <input type="number" class="form-control" id="price" name="price" value="{$data.price}" placeholder="price" />
        </div>
      </div>

      <div class="mb-3 row">
        <div class="col-2"><label for="status" class="form-label">是否启用:</label></div>
        <div class="col-10">
          <input type="radio" class="form-check-input" id="radio1" name="status" value="1" {if $data.status==1} checked
            {/if} />
          <label class="form-check-label" for="radio1">上架</label>
          <input type="radio" class="form-check-input" id="radio2" name="status" value="2" {if $data.status==2} checked
            {/if} />
          <label class="form-check-label" for="radio2">下架</label>
        </div>
      </div>


      <!-- <div class="mb-3 row">
        <div class="col-2"><label for="hot" class="form-label">热门商品:</label></div>
        <div class="col-10">
          {if $user['group_id']==1}
          <input type="radio" class="form-check-input" id="radio3" name="hot" value="1" {if $data.hot==1} checked
            {/if} />
          <label class="form-check-label" for="radio3">热门</label>
          <input type="radio" class="form-check-input" id="radio4" name="hot" value="0" {if $data.hot!=1} checked
            {/if} />
          <label class="form-check-label" for="radio4">普通</label>
          {else}
          <span class="{if $data.hot==1}bi-check-lg{else}bi-x-lg{/if}" style=""></span>
          {/if}
        </div>
      </div> -->


      <div class="mb-3 row">
        <div class="col-2">
          <label for="file" class="form-label">本地图片:</label>
        </div>
        <div class="col" style="display: flex;">
          {if $data.image}
          {foreach $data.image as $image}
          <div style="border:1px solid #ccc;text-align: center;margin-right:2px;">
            <img class="goods_image" src="{$image}" style="width:70px;" />
            <span class="bi-x-lg img_remove" row_id="{$data.id}" src="{$image}" title="删除图片"
              style="cursor: pointer;"></span>
          </div>
          {/foreach}
          {/if}
          <div>
            <button id="img_add" type="button" class="btn btn-info"><span class="bi-plus-lg"></span></button>
          </div>
          <input id="file1" type="file" name="file1" style="display: none;" />
        </div>
      </div>

      <!-- <div class="mb-3 row">
        <label for="title" class="form-label">详细介绍:</label>
        <div class="col"><textarea id="content" name="content" class="form-control">{$data.content}</textarea></div>
      </div> -->

      <!-- 详情图片集 -->
      <!-- <div class="mb-3 row">
        <div class="col-2">
          <label for="file" class="form-label">更多详情图片:</label>
        </div>
        <div class="col" style="display: flex;">
          {if $data.dt_imgs}
          {foreach $data.dt_imgs as $image}
          <div style="border:1px solid #ccc;text-align: center;margin-right:2px;">
            <img class="goods_image" src="{$image}" style="width:100px;" />
            <span class="bi-x-lg img_remove2" row_id="{$data.id}" src="{$image}" title="删除图片"
              style="cursor: pointer;"></span>
          </div>
          {/foreach}
          {/if}
          <div>
            <button id="img_add2" type="button" class="btn btn-info"><span class="bi-plus-lg"></span></button>
          </div>
          <input id="file2" type="file" name="file2" style="display: none;" />
        </div>
      </div> -->


      <button type="button" class="btn btn-primary" onclick="doSave()">保存(Save)</button>

    </form>
  </div>

  <script type="text/javascript">
    // var editor = Jodit.make('#content', {
    //   toolbarButtonSize: 'small',
    //   language: 'zh_cn',
    // });

    function doSave() {
      if (!$("#name").val() || !$("#price").val()) {
        layer.msg("别瞎闹！", function () { });
        return false;
      }
      $('form').submit();
    }

    $(document).ready(function () {

      $(".img_remove").on('click', function () {
        var src = $(this).attr('src');
        var row_id = $(this).attr('row_id');

        //询问框
        layer.confirm('是否确定删除图片?', {
          btn: ['确定', '取消'] //按钮
        }, function () {

          $.post('/index.php/sys/img_remove', { tb: 'goods', row_id: row_id, field: 'image', src: src }, function (res) {
            if (res.code) {
              layer.msg(res.msg);
              location.reload();
            }
          })

        }, function () {
          layer.msg("好的!");
          return 0;
        });
      })


      // 详情图
      $(".img_remove2").on('click', function () {
        var src = $(this).attr('src');
        var row_id = $(this).attr('row_id');

        //询问框
        layer.confirm('是否确定删除图片?', {
          btn: ['确定', '取消'] //按钮
        }, function () {

          $.post('/index.php/sys/img_remove', { tb: 'goods', row_id: row_id, field: 'dt_imgs', src: src }, function (res) {
            if (res.code) {
              layer.msg(res.msg);
              location.reload();
            }
          })

        }, function () {
          layer.msg("好的!");
          return 0;
        });
      })





      $('#img_add').on('click', function () { $('#file1').click() });
      $('#img_add2').on('click', function () { $('#file2').click() });

      //提交图片
      $("#file1").on('change', function (e) {
        $("#tb").remove(); $("#source_url").remove();
        var el1 = '<input id="tb" name="tb" name="tb"  type="hidden" value="goods+image" />';
        var el2 = '<input id="source_url" name="source_url" type="hidden" value="/goods/edit/id/' + $('#id').val() + '" />';
        $('#file1').after(el1).after(el2);

        $("form").attr('action', '/sys/img_add').submit();
      })


      //提交图片
      $("#file2").on('change', function (e) {
        $("#tb").remove(); $("#source_url").remove();
        var el1 = '<input id="tb" name="tb"  type="hidden" value="goods+dt_imgs" />';
        var el2 = '<input id="source_url" name="source_url" type="hidden" value="/goods/edit/id/' + $('#id').val() + '" />';
        $('#file2').after(el1).after(el2);

        $("form").attr('action', '/sys/img_add').submit();
      })

    })  
  </script>


</body>

</html>